{{ template "base.html" .}}


{{ define "body" }}
<div class="container">
    <div class="container" style="overflow: auto;">
    <table class="table table-striped table-bordered table-condensed table-hover">
        <caption><h4>{{ .Labels.title }}</h4></caption>
        <tbody>
        <tr>
            <td><div class="text-right">{{ .Labels.name }}</div></td>
            <td>{{ .Dbms_data.name }}</td>
        </tr>
        <tr>
            <td><div class="text-right">{{ .Labels.dbms }}</div></td>
            <td>{{ .Dbms_data.dbms.full_name }}</td>
        </tr>
        <tr>
            <td><div class="text-right">{{ .Labels.creation_time }}</div></td>
            <td>{{ .Dbms_data.creation_time }}</td>
        </tr>
        </tbody>
    </table>
    </div>

    <hr>
    <div class="container">Compare with
        <select class="selectpicker" id="compare" onchange="compare_.Dbms_data()">
            <option value="none">None</option>
            {{ range $peer := .Peer_data }}
            <option value="{{ $peer.pk }}">{{ $peer.name }}</option>
            {{ end}}
            
        </select>
    </div>

    <div id="featured">
        <h4>{{ .Labels.featured_data }} | <a onclick="switch_content()">Show {{ .Labels.all_data }}</a></h4>
        <table class="table table-striped table-bordered table-condensed table-hover" style="table-layout: fixed;">
        <caption></caption>
        <tr>
            <td><h5><strong>Name</strong><h5></td>
            <td><h5><strong>Value</strong></h5></td>
            {{ if ne .Compare  "none" }}
                <td><h5><strong>Comparing Value</strong></h5></td>
            {{ end}}
        </tr>
        {{ range $pair := .Featured_data }}
            {{ if ne  $pair.two  $pair.one }}
            <tr class="danger">
            {{ else }}
            <tr>
            {{ end}}
                {{ if eq .Data_type "knobs" }}
                <td style="word-wrap:break-word;"><a href=" urlfor 'dbms_knobs_ref' .Dbms_data.dbms.name .Dbms_data.dbms.version $pair.Field0 ">{{ $pair }}</a></td>
                {{ else }}
                <td style="word-wrap:break-word;"><a href=" urlfor 'dbms_metrics_ref' .Dbms_data.dbms.name .Dbms_data.dbms.version $pair.Field0 ">{{ $pair.Field0 }}</a></td>
                {{ end}}
                <td style="word-wrap:break-word;">{{ $pair.Field1 }}</td>
                {{ if ne .Compare  "none" }}
                <td style="word-wrap:break-word;">{{ $pair.Field2 }}</td>
                {{ end}}
            </tr>
        {{ end}}
        </table>
    </div>
    <div id="para_table">
        <h4>{{ .Labels.all_data }} | <a onclick="switch_content()">Show {{ .Labels.featured_data }}</a></h4>
        <table class="table table-striped table-bordered table-condensed table-hover" style="table-layout: fixed;">
        <caption></caption>
        <tr>
            <td><h5><strong>Name</strong><h5></td>
            <td><h5><strong>Value</strong></h5></td>
            {{ if ne .Compare  "none" }}
                <td><h5><strong>Comparing Value</strong></h5></td>
            {{ end}}
        </tr>
        {{ range $pair := .All_data }}
            {{ if ne $pair.Field2  $pair.Field1 }}
            <tr class="danger">
            {{ else }}
            <tr>
            {{ end}}
                {{ if eq .Data_type "knobs" }}
                <td style="word-wrap:break-word;"><a href=" urlfor dbms_knobs_ref .Dbms_data.dbms.name .Dbms_data.dbms.version $pair.Field0 ">{{ $pair.Field0 }}</a></td>
                {{ else }}
                <td style="word-wrap:break-word;"><a href=" urlfor dbms_metrics_ref .Dbms_data.dbms.name .Dbms_data.dbms.version $pair.Field0">{{ $pair.Field0 }}</a></td>
                {{ end}}
                <td style="word-wrap:break-word;">{{ $pair.Field1 }}</td>
                {{ if ne .Compare  "none" }}
                <td style="word-wrap:break-word;">{{ $pair.Field2 }}</td>
                {{ end}}
            </tr>
        {{ end}}
        </table>
    </div>
</div>


<script language="javascript">
$(function() {
    $("#para_table").hide();
    $('.selectpicker').selectpicker();
    $("select[id='compare']").val('{{ .Compare }}');
    $('.selectpicker').selectpicker('refresh');
});

function switch_content() {
    $("#featured").toggle();
    $("#para_table").toggle();
}

function compare_dbms_data() {
	url = "/projects/{{ .Dbms_data.session.project.pk }}/sessions/{{ .Dbms_data.session.pk }}/{{ .Data_type }}/{{.Dbms_data.pk}}/?compare=" + $("select[id='compare']").val();
    window.location = url;
}
</script>
{{ end }}
